<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>文章</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <meta name="description" content=" ">
    <meta name="keywords" content="">
    <meta name="format-detection" content="telephone=no">
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Expires" content="0">
    <link rel="stylesheet" type="text/css" href="css/reset.css">
    <link rel="stylesheet" type="text/css" href="css/docu.css">
    <script src="js/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
    <div id="wrapper">
        <div id="page-content" class="rich_media_inner">
            <div id="img-content">
                <h2 class="rich_media_title" id="activity-name"></h2>
                <div class="rich_media_meta_list">
                    <em id="post-date" class="rich_media_meta"></em>
                    <a id="post-user" class="rich_media_meta" href="javascript:docu.showCode()">外地在上海</a>
                    <span id="author" class="rich_media_meta"></span>
                </div>
                <div class="rich_media_content" id="js_content">
                    <p style="max-width: 100%; min-height: 1em; white-space: normal; color: rgb(62, 62, 62); font-size: 16px; line-height: 25.6px; font-family: 'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif; box-sizing: border-box !important; word-wrap: break-word !important; background-color: rgb(255, 255, 255);"><img data-type="gif" data-src="http://mmbiz.qpic.cn/mmbiz_gif/Bwld5AFO7JXOcwQ0N4etOrSn8OkI44qBUkx3icCibpytHZyo6Cq6B9AhHQ3LSdibiaqnENYfPxWViaBPbDXYjcHdyVg/0?" data-ratio="0.1" data-w="500" style="line-height: 25.6px; text-align: center; white-space: normal; width: auto !important; height: auto !important; visibility: visible !important;" src="http://mmbiz.qpic.cn/mmbiz_gif/Bwld5AFO7JXOcwQ0N4etOrSn8OkI44qBUkx3icCibpytHZyo6Cq6B9AhHQ3LSdibiaqnENYfPxWViaBPbDXYjcHdyVg/0?tp=webp&amp;wxfrom=5&amp;wx_lazy=1" class=" __bg_gif" data-order="0" data-fail="0"></p>
                    <div class="main_content">

                    </div>
                </div>
                <div class="rich_media_tool">
                    <a class="media_tool_meta meta_primary" id="js_view_source" href="#">阅读原文</a>
                    <div id="js_read_area3" class="media_tool_meta tips_global meta_primary">阅读 <span id="readNum3"></span></div>
                    <span class="media_tool_meta meta_primary tips_global meta_praise" id="like3">
                        <i class="icon_praise_gray"></i>
                        <span class="praise_num" id="likeNum3"></span>
                    </span>
                    <a id="js_report_article3" class="media_tool_meta tips_global meta_extra" href="##">投诉</a>
                </div>
            </div>
        </div>
        <div class="qr_code"><img id="qr_code" src="imgs/moren.jpg" alt=""></div>
    </div>
</body>
<script>
    var docu = {
        getData:function(){
            var _this = this; 
            $.ajax({
                url: 'http://chinafengren.com/ajx/mpArticleContent',
                timeout: 60000,
                data: {},
                success: function (r) {
                    var datas = JSON.parse(r);
                    _this.info(datas.info);
                    $(".main_content").html(datas.content);
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    console.log("textStatus:" + textStatus + "--error:" + jqXHR.responseText);
                }
            })
        },
        info:function(data){
            $("#activity-name").html(data.title);
            $("#post-date").html(data.time);
            $("#author").html(data.author);
        },
        showCode:function(){
            $(".qr_code").fadeIn();
        }
    }
    window.onload = function(){
        docu.getData();
        $(".qr_code").on("click",function(event){
            event.stopPropagation();
            var ele = event.target;
            if(ele.getAttribute("id") != "qr_code"){
                $(".qr_code").fadeOut();
            }
        })
    }
</script>
</html>